import QtQuick 2.6

import "../Base/UiBase"
import "../Base/Config"
import Code 1.0

import "FallView.js" as Code

Flickable {
    id: root

    property double spacing: Size.elementInterval
    property string arrangeStatus: {
        if(model.count === 0)
            return "Empty"
        if(leftModel.count + rightModel.count === model.count)
            return "Ok"
        return "Arranging"
    }


    property Component delegate
    property var model
    onModelChanged: Code.onModelChanged()

    contentWidth: width
    contentHeight: contentItem.childrenRect.height
    Item {
        clip: true
        width: parent.width
        height: leftList.height > rightList.height ? leftList.height : rightList.height
        Column {
            id: leftList

            onHeightChanged: Code.onHeightChanged()

            width: 355 * Size.ratio
            anchors {
                left: parent.left
                top: parent.top
            }
            spacing: root.spacing
            Repeater {
                delegate: root.delegate
                model: leftModel
            }
        }
        Column {
            id: rightList

            onHeightChanged: Code.onHeightChanged()

            width: 355 * Size.ratio
            anchors {
                right: parent.right
                top: parent.top
            }
            spacing: root.spacing
            Repeater {
                delegate: root.delegate
                model: rightModel
            }
        }
    }
    ListModel {
        id: leftModel
    }
    ListModel {
        id: rightModel
    }
}
